<template>
    <div>
        <div class="login_top clearfix">
		<a href="index.html" class="login_logo"><img src="../assets/images/logo02.png"></a>	
	</div>

	<div class="login_form_bg">
		<div class="login_form_wrap clearfix">
			<div class="login_banner fl"></div>
			<div class="slogan fl">日夜兼程 · 急速送达</div>
			<div class="login_form fr">
				<div class="login_title clearfix">
					<h1>用户登录</h1>
					<a href="#">立即注册</a>
				</div>
				<div class="form_input">
					<form>
						<input type="text" name="username" class="name_input" placeholder="请输入用户名" v-model="username">
						<div class="user_error">输入错误</div>
						<input type="password" name="pwd" class="pass_input" placeholder="请输入密码" v-model="password">
						<div class="pwd_error">输入错误</div>
						<div class="more_input clearfix">
							<input type="checkbox" name="" v-model="record">
							<label>记住用户名</label>
							<a href="#">忘记密码</a>
						</div>
						<input type="button" name="" value="登录" class="input_submit" @click="login">
					</form>
				</div>
			</div>
		</div>
	</div>

	<div class="footer no-mp">
		<div class="foot_link">
			<a href="#">关于我们</a>
			<span>|</span>
			<a href="#">联系我们</a>
			<span>|</span>
			<a href="#">招聘人才</a>
			<span>|</span>
			<a href="#">友情链接</a>		
		</div>
		<p>CopyRight © 2016 北京天天生鲜信息技术有限公司 All Rights Reserved</p>
		<p>电话：010-****888    京ICP备*******8号</p>
	</div>
    </div>
</template>

<script>
import axios from 'axios'
export default {
    data() {
        return {
            username:localStorage.getItem('username'),
            password:'',
            record:localStorage.getItem('record')
        }
    },
    methods: {
        login(){
            axios({
                'url':'http://127.0.0.1:8000/login/',
                'method':'POST',
                'data':{
                    username:this.username,
                    password:this.password
                }
            }).then(resp=>{
                console.log(resp.data)
                if(resp.data.code==200){
                    sessionStorage.setItem('token',resp.data.token)
                    sessionStorage.setItem('username',this.username)

                    //判断是否需要记住用户名
                    if (this.record){
                        localStorage.setItem('username',this.username)
                        localStorage.setItem('record',true)
                    }else{
                        localStorage.removeItem('record')
                        localStorage.removeItem('username')
                    }
                }
            }).catch(error=>{
                console.log(error)
            })
        }
    },
    created() {

    }
}
</script>

<style scoped>

</style>
